<template>
    <H2>ELSE-IF</H2>
    <button @click="awesome = !awesome">Toggle</button>
    <h3 v-if="awesome">Vue is awesome!</h3>
    <h3 v-else>Oh no 😢</h3>
    </template>
    
    <script>
    export default {
     data(){
      return{
        awesome:true
      }
     }
    }
    </script>
    
    <!-- Add "scoped" attribute to limit CSS to this component only -->
    <style scoped>
    
    </style>
    